<template>
  <Layout style="height:100%">
    <Sider style="border-right: 1px solid #eeeeee">
      <Layout>
        <Header style="padding: 10px 3px;" class="right-line">
          <ButtonGroup size="s">
            <Button icon="h-icon-inbox" @click="importModel">导入</Button>
            <Button :disabled="!current" icon="h-icon-trash" @click="deleteCurrent">删除</Button>
            <Button icon="h-icon-refresh" @click="reload">刷新</Button>
          </ButtonGroup>
        </Header>
        <Content style="border-top: 1px solid #eeeeee">
          <Menu :datas="models" className="h-menu-white" @select="onModuleSelect"/>
        </Content>
      </Layout>
    </Sider>
    <Layout style="padding:20px">
      <Model style="height: 100%" :id="current"></Model>
    </Layout>
    <Modal v-model="file_import_opened" >
      <div slot="header">从文件导入模型</div>
      <div style="width: 500px">
        <Form ref="file_form" :model="upload" :rules="rules" :labelWidth="110" class="title-suffix">
          <FormItem label="模块名" prop="module" required>
            <input type="text" v-model="upload.module" placeholder="模块名称"/>
          </FormItem>
          <FormItem label="表前缀">
            <input type="text" v-model="upload.prefix" placeholder="忽略的表前缀，如有多个用','隔开。a_,ab_类型前缀不需填写。"/>
          </FormItem>
          <FormItem label="模型文件" required>
            <FileInput v-model="upload.file" accept=".zdm,.json,.ndm2" placeholder="zdm,pm,ndm2 文件"/>
          </FormItem>
          <FormItem label="模型存在时" required>
            <Radio dict="UpdateType" v-model="upload.upType"></Radio>
          </FormItem>
        </Form>
      </div>
      <div slot="footer">
        <Button class="h-btn" @click="file_import_opened=false">取消</Button>
        <Button :loading="file_uploading" class="h-btn h-btn-primary" @click="uploadModel">确定</Button>
      </div>
    </Modal>
    <Modal v-model="db_import_opened">
      <div slot="header">从数据库导入模型</div>
      <div style="width: 500px;height: 450px">
        <Form ref="db_form" :model="upload" :rules="rules" :labelWidth="110" class="title-suffix">
          <FormItem label="模块名" prop="module" required>
            <input type="text" v-model="upload.module" placeholder="模块名称"/>
          </FormItem>
          <FormItem label="表前缀" prop="prefix">
            <input type="text" v-model="upload.prefix" placeholder="忽略的表前缀，如有多个用','隔开。a_,ab_类型前缀不需填写。"/>
          </FormItem>
          <FormItem label="模型存在时" required>
            <Radio dict="UpdateType" v-model="upload.upType"></Radio>
          </FormItem>
        </Form>
        <Table ref="impTable" :datas="tables" :height="250" :width="500" checkbox selectWhenClickTr>
          <TableItem title="序号" prop="$serial" :width="50"></TableItem>
          <TableItem title="表名" prop="name"></TableItem>
          <TableItem title="类型" prop="type" :width="90"></TableItem>
        </Table>
      </div>
      <div slot="footer">
        <Button class="h-btn" @click="db_import_opened=false">取消</Button>
        <Button :loading="db_importing" class="h-btn h-btn-primary" @click="importModelFromTable">确定</Button>
      </div>
    </Modal>
  </Layout>
</template>
<script>
import {DataSource,ajax,HeyUI} from 'framework'
import FileInput from "coms/FileInput.vue";
import Model from 'model'
HeyUI.initDict({
  UpdateType: { 1: '覆盖', 2: '更新', 3: '跳过' }
});
//用到的数据源
let models=new DataSource('dev/models')
let tables=new DataSource('dev/tables')

export default {
  name:'Models',
  components:{FileInput,Model},
  data(){
    return {
      models:models.load().data,
      current:'',
      file_import_opened:false,
      db_import_opened:false,
      file_uploading:false,
      db_importing:false,
      tables:tables.data,
      rules:{},
      upload:{
        module:'',
        file:null,
        upType:3,
        prefix:'',
      }
    }
  },
  methods:{
    reload(){
      models.load()
    },
    deleteCurrent(){
      HeyUI.$Confirm('确定删除？', '删除模型').then(() => {
        ajax.delete('dev/del',{id:this.current}).then(r=>{
          this.current=''
          models.load()
          HeyUI.$Message.success('模型文件已删除！');
        })
      }).catch(() => {

      });

    },
    /**
     * 导入模型
     */
    importModel(){
      let self=this;
      this.$Modal({
        title: '模型导入',
        hasCloseIcon:true,
        content: '请选择导入模式',
        buttons: [{
          type: 'db',
          name: '数据库导入',
          color: 'primary'
        }, {
          type: 'file',
          name: '文件导入',
          color: 'primary'
        }],
        events:{
          db:function(m){
            m.close()
            tables.load()
            self.db_import_opened=true
          },
          file:function(m){
            m.close();
            self.file_import_opened=true
          }
        }
      })
    },
    onModuleSelect(v){
      let k=v.key;
      if(/\.json$/.test(k)){
        this.current=v.key;
      }else{
        this.current=''
      }
    },
    uploadModel(){
      let validResult = this.$refs.file_form.valid();
      if (!validResult.result) {
        return;
      }
      this.file_uploading=true;
      ajax.formPost('dev/upload',this.upload).then(r=>{
        this.current=''
        models.load()
        this.file_uploading=false;
        this.file_import_opened=false;
      })
    },
    importModelFromTable(){
      let validResult = this.$refs.db_form.valid();
      if (!validResult.result) {
        return;
      }
      let selections=this.$refs.impTable.getSelection();
      if(selections.length==0){
        HeyUI.$Message.warn("未选择导入的表")
        return;
      }
      let tables=selections.map(it=>it.name).join(",");
      this.db_importing=true
      let params=Object.assign({tables:tables},this.upload);
      params.file=null;
      ajax.post('dev/import',params).then(r=>{
        this.db_importing=false
        models.load()
        this.current=''
        this.db_import_opened=false
      })
    }
  }
}
</script>
